// uno.config.js
import { defineConfig, presetUno, presetAttributify, transformerVariantGroup } from 'unocss'
import transformerDirectives from '@unocss/transformer-directives'
import presetTypography from '@unocss/preset-typography'
const rules = []
rules.push([/^(.+)-(.+)$/, async (match, ctx) => {
  return `${match.join('-')}`
}])

export default defineConfig({
  shortcuts: [
    ['center', 'flex items-center justify-center']
  ],
  presets: [
    presetUno(), // 添加 UnoCSS 的默认样式预设
    presetAttributify(),
    presetTypography(),
  ],
  transformers: [
    transformerDirectives(),
    transformerVariantGroup(),
  ],
  separators: '__',
  rules: [
    [/^bg-(.*)$/, ([, d]) => ({ [`background-color`]: `#${d}` })],
    [/^c-(.*)$/, ([, d]) => ({ color: `#${d}` })],
    [/^mt-(.*)$/, ([, d]) => ({ [`margin-top`]: `${d} !important` })],
    [/^mb-(.*)$/, ([, d]) => ({ [`margin-bottom`]: `${d} !important` })],
    [/^ml-(.*)$/, ([, d]) => ({ [`margin-left`]: `${d} !important` })],
    [/^mr-(.*)$/, ([, d]) => ({ [`margin-right`]: `${d} !important` })],
    [`h-(.*)`, ([, d]) => {
      switch (d) {
        case 'full':
          return { height: '100%' };
        default:
          return { height: `${d}px` }
      }
    }],
    [`display-(.*)`, ([, d]) => ({ display: `${d}` })]
  ]
})